<script setup>
import { onMounted, ref, getCurrentInstance } from 'vue'
import { ElMessage } from 'element-plus'
const { proxy } = getCurrentInstance();

var dataList = ref([]);
var currentPage = ref(1);
var totalCount = ref(0);

onMounted(() => {
    loadList();
})

function handleCurrentChange(row) {
    console.log(row);
    currentPage.value = row;
    loadList();
}

async function loadList() {

    var ret = await proxy.axios.get('/sys/log/list', {
        params: {
            pageIndex: currentPage.value,
            pageSize: 12,
        }
    });
    if (ret.data.code == 0) {
        dataList.value.length = 0;
        totalCount.value=ret.data.data.total;
        proxy.lodash(ret.data.data.items).forEach((v) => {
            dataList.value.push(v);
        })
    }
}

async function handleDelete(index, row) {
    console.log(row._id);
    var ret = await proxy.axios.delete('/sys/log/', { data: { _id: row._id } });
    if (ret.data.code == 0) {
        loadList();
    }
    else {
        ElMessage({
            message: ret.data.data,
            type: 'error',
        })
    }
}
</script>

<template>
    <el-page-header title="日志信息" icon="">
        <template #extra>
            <div>
                <el-button type="primary" class="ml-2"><el-icon>
                        <CirclePlus />
                    </el-icon>新建</el-button>
            </div>
        </template>
        <div>
            <el-table class="tableClass" :data="dataList" style="width: 100%" :default-expand-all="true" border
                :header-cell-style="{ background: '#eef1f6', color: '#606266' }" :row-style="{ height: '50px' }">
                <el-table-column type="index" width="45"></el-table-column>
                <el-table-column prop="url" label="地址" :show-overflow-tooltip="true"> </el-table-column>
                <el-table-column prop="method" label="方法"> </el-table-column>
                <el-table-column prop="body" label="参数" :show-overflow-tooltip="true"> </el-table-column>
                <el-table-column prop="ip_address" label="IP"> </el-table-column>
                <el-table-column prop="creator" label="用户Id"> </el-table-column>

                <el-table-column prop="timestamp" label="日志时间"> </el-table-column>

            </el-table>
            <el-pagination :page-size="12" :current-page="currentPage" layout="total, prev, pager, next" :total="totalCount"
                @current-change="handleCurrentChange">
            </el-pagination>
        </div>

    </el-page-header>
</template>


<style scoped></style>